@import "../abstracts/variables.scss";
@import "../abstracts//mixins";

.sessionsContainer {
  margin-top: 0.2rem;

  &__currentSessionInput {
    color: $text-area-color-dark;
    border-radius: 0.2rem;
    padding: 0.8rem 1rem;
    padding-left: 1.2rem;
    font-size: 1.4rem;
    outline: none;
    border: 1px solid rgba(34, 34, 34, 0.192);
    width: 20rem;

    &:hover {
      cursor: not-allowed;
    }
  }

  &__button {
    @include buttonMixinCustom(
      $button-backgroundColor-2,
      $button-backgroundColor-3,
      1.3rem,
      11rem,
      1rem,
      1rem,
      0rem,
      0rem,
      0.2rem,
      0,
      0rem
    );
  }

  &__newSessionContainer {
    @include flexbox;
    @include justify-content(space-between);
    @include flex-direction(row);

    &__input {
      width: 75%;
      color: $text-area-color-dark;
      border-radius: 0.5rem;
      padding: 0.8rem 1rem;
      padding-left: 1.2rem;
      font-size: 1.4rem;
      outline: none;
      border: 1px solid rgba(34, 34, 34, 0.192);
    }

    &__button {
      @include buttonMixinCustom(
        $button-backgroundColor-2,
        $button-backgroundColor-3,
        1.5rem,
        20%,
        0.7rem,
        0.7rem,
        0.7rem,
        0.7rem,
        0.8rem,
        0,
        1rem
      );
    }
  }
}
